<template>
  <ad-table v-if="$attrs.hasOwnProperty('ux-grid')" :data="list" :show-summary="summary" v-loading="initLoading" v-bind="$attrs"
            @row-click="selectRow" :filterQuery="filterQuery" @search="getInitList">
    <slot></slot>
  </ad-table>
  <ad-table v-else :data="list" :show-summary="summary" v-loading="initLoading" v-bind="$attrs"
            @row-click="selectRow" :filterQuery="filterQuery" @search="getInitList"
            v-el-table-infinite-scroll="getMoreList" :infinite-scroll-distance="600"
            :infinite-scroll-disabled="complete">
    <slot></slot>
  </ad-table>
</template>

<script>

class Page { begin = 0; count = 40 }
class Params extends Page {}
class Query extends Params {}

import AdTable from '../AdTable'

export default {
  components: { AdTable },
  data() {
    return {
      list: [],
      summary: {},
      initLoading: true,
      complete: false,
      selectRow: [],
      filterQuery: {}
    }
  },
  created() {
    this.getInitList()
  },
  methods: {
    getInitList() {
      this.$attrs.api.getList({query: {...new Query(), ...this.filterQuery}}).then(res => {
        this.afterGetInitList(res.data)
      })
    },
    afterGetInitList(data) {
      this.list = data.list
      this.summary = {carCount: 20}
      this.initLoading = false
      this.loading = false
    },
    getMoreList() {

    }
  }
}
</script>

<style scoped>

</style>